<?php use_helper('I18N', 'Date') ?>

<?php echo image_tag($resizedPhotoUrl, array("alt" => $doctor_show->getCaption(), "id" => "cropbox")) ?>
<form action="/doctor-show-crop-photo/<?php echo $doctor_show->getId() ?>" method="post" id="crop_photo_form">
    <input type="hidden" id="x" name="x" />
    <input type="hidden" id="y" name="y" />
    <input type="hidden" id="w" name="w" />
    <input type="hidden" id="h" name="h" />
    <ul class="sf_admin_actions">
        <li class="sf_admin_action_cancel">
            <button id="crop-photo-cancel" type="submit" class="blue-button-30" onclick="doCancel('/doctor_show'); return false;">Cancel</button>  
        </li>
        <li class="sf_admin_action_save">
            <button id="crop-photo-save" type="submit" class="blue-button-30">Crop & Save</button>
        </li>
        <li class="sf_admin_action_done">
            <button id="crop-photo-done" type="submit" class="blue-button-30" onclick="doDone('/doctor_show'); return false;">Done</button>
        </li>
    </ul>
</form>
<script type="text/javascript">
    $(document).ready(function(){
        $(function(){
            $('#cropbox').Jcrop({
                aspectRatio: 1,
                minSize: [96, 96],
                maxSize: [400, 400],
                onSelect: updateCoords
            });
        });

        function updateCoords(c)
        {
            $('#x').val(c.x);
            $('#y').val(c.y);
            $('#w').val(c.w);
            $('#h').val(c.h);
        };

        function checkCoords()
        {
            if (parseInt($('#w').val())) return true;
            alert('Please select a crop region then press submit.');
            return false;
        }; 
                                    
        $("#crop-photo-save").click(function(){            
            if(checkCoords())
            {                    
                $("#crop_photo_form").ajaxSubmit(function(data){
                    window.location.href = "/doctor-show/<?php echo $doctor_show->getId() ?>/edit";
                });  
            }          
            return false;
        });
    });
</script>